<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>品牌查询 - 大电商后台管理系统</title>
    <link rel="icon" href="../../images/icon.png" type="image/ico">
    <meta name="keywords" content="大电商后台管理系统">
    <meta name="description" content="大电商后台管理系统">
    <meta name="author" content="yinqi">
    <link href="../../css/bootstrap.min.css" rel="stylesheet">
    <link href="../../css/materialdesignicons.min.css" rel="stylesheet">
    <link href="../../css/style.min.css" rel="stylesheet">
</head>

<body>
<div class="lyear-layout-web">
    <div class="lyear-layout-container">
        <!--左侧导航-->
        <aside class="lyear-layout-sidebar">

            <!-- logo -->
            <div id="logo" class="sidebar-header">
                <a href="../../index.html"><img src="../../images/logo-sidebar.png" title="LightYear" alt="LightYear" /></a>
                <!--
                        <a href="index.html" class = "logo">大电商后台管理系统</a>
                -->
            </div>
            <div class="lyear-layout-sidebar-scroll">
                <nav class="sidebar-main">
                    <ul class="nav nav-drawer">
                        <li class="nav-item active"> <a href="../../index.html"><i class="mdi mdi-home"></i> 后台首页</a> </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-format-align-justify"></i> 分类管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../category/list.html">分类查询</a> </li>
                                <li> <a href="../category/add.html">添加分类</a> </li>
                                <li> <a href="../category/relation.html">分类与品牌关系绑定</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-collage"></i> 品牌管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../brand/list.html">品牌列表</a> </li>
                                <li> <a href="../brand/add.html">添加品牌</a> </li>
                                <li> <a href="../brand/relation.html">品牌与分类关系绑定</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-camera-burst"></i> 商品属性管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../property/list.html">商品属性列表</a> </li>
                                <li> <a href="../property/add.html">添加商品属性</a> </li>
                                <li> <a href="../property/relation.html">商品属性与分类关系绑定</a> </li>
                                <li> <a href="../specificaton/option.html">商品属性值管理</a> </li>
                                <li> <a href="../property/sku.html">商品属性值与SKU值绑定</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-calendar-text"></i> 商品规格管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../specificaton/list.html">商品规格列表</a> </li>
                                <li> <a href="../specificaton/add.html">添加商品规格</a> </li>
                                <li> <a href="../specificaton/relation.html">商品规格与分类关系绑定</a> </li>
                                <li> <a href="../specificaton/option.html">商品规格值管理</a> </li>
                                <li> <a href="../specificaton/sku.html">商品规格值与SKU值关系绑定</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-folder-remove"></i> 商品SPU管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../spu/list.html">商品SPU列表</a> </li>
                                <li> <a href="../spu/add.html">添加商品SPU</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-folder-star"></i> 商品SKU管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../sku/list.html">商品SKU列表</a> </li>
                                <li> <a href="../sku/add.html">添加商品SKU</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-account"></i> 用户管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../user/list.html">用户列表</a> </li>
                                <li> <a href="../user/add.html">添加用户</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-cube"></i> 用户收货地址管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../address/list.html">用户收货地址列表</a> </li>
                                <li> <a href="../address/add.html">添加用户收货地址</a> </li>
                            </ul>
                        </li>
                        <li class="nav-item nav-item-has-subnav">
                            <a href="javascript:void(0)"><i class="mdi mdi-thumb-up"></i> 用户点赞管理</a>
                            <ul class="nav nav-subnav">
                                <li> <a href="../praise/list.html">用户点赞列表</a> </li>
                            </ul>
                        </li><li class="nav-item nav-item-has-subnav">
                        <a href="javascript:void(0)"><i class="mdi mdi-message"></i> 用户评论管理</a>
                        <ul class="nav nav-subnav">
                            <li> <a href="../comment/list.html">用户评论列表</a> </li>
                        </ul>
                    </li>

                    </ul>
                </nav>

                <div class="sidebar-footer">
                    <p class="copyright">Copyright &copy; 2021. <a target="_blank" href="http://lyear.itshubao.com">zzh</a> All rights reserved.</p>
                </div>
            </div>

        </aside>
        <!--End 左侧导航-->

        <!--头部信息-->
        <header class="lyear-layout-header">

            <nav class="navbar navbar-default">
                <div class="topbar">

                    <div class="topbar-left">
                        <div class="lyear-aside-toggler">
                            <span class="lyear-toggler-bar"></span>
                            <span class="lyear-toggler-bar"></span>
                            <span class="lyear-toggler-bar"></span>
                        </div>
                        <span class="navbar-page-title"> 品牌查询 </span>
                    </div>

                    <ul class="topbar-right">
                        <li class="dropdown dropdown-profile">
                            <a href="javascript:void(0)" data-toggle="dropdown">
                                <img class="img-avatar img-avatar-48 m-r-10" src="../../images/users/avatar.jpg" alt="zzh" />
                                <span>zzh <span class="caret"></span></span>
                            </a>
                            <ul class="dropdown-menu dropdown-menu-right">
                                <li> <a href="lyear_pages_profile.html"><i class="mdi mdi-account"></i> 个人信息</a> </li>
                                <li> <a href="lyear_pages_edit_pwd.html"><i class="mdi mdi-lock-outline"></i> 修改密码</a> </li>
                                <li> <a href="javascript:void(0)"><i class="mdi mdi-delete"></i> 清空缓存</a></li>
                                <li class="divider"></li>
                                <li> <a href="lyear_pages_login.html"><i class="mdi mdi-logout-variant"></i> 退出登录</a> </li>
                            </ul>
                        </li>
                        <!--切换主题配色-->
                        <li class="dropdown dropdown-skin">
                            <span data-toggle="dropdown" class="icon-palette"><i class="mdi mdi-palette"></i></span>
                            <ul class="dropdown-menu dropdown-menu-right" data-stopPropagation="true">
                                <li class="drop-title"><p>主题</p></li>
                                <li class="drop-skin-li clearfix">
                  <span class="inverse">
                    <input type="radio" name="site_theme" value="default" id="site_theme_1" checked>
                    <label for="site_theme_1"></label>
                  </span>
                                    <span>
                    <input type="radio" name="site_theme" value="dark" id="site_theme_2">
                    <label for="site_theme_2"></label>
                  </span>
                                    <span>
                    <input type="radio" name="site_theme" value="translucent" id="site_theme_3">
                    <label for="site_theme_3"></label>
                  </span>
                                </li>
                                <li class="drop-title"><p>LOGO</p></li>
                                <li class="drop-skin-li clearfix">
                  <span class="inverse">
                    <input type="radio" name="logo_bg" value="default" id="logo_bg_1" checked>
                    <label for="logo_bg_1"></label>
                  </span>
                                    <span>
                    <input type="radio" name="logo_bg" value="color_2" id="logo_bg_2">
                    <label for="logo_bg_2"></label>
                  </span>
                                    <span>
                    <input type="radio" name="logo_bg" value="color_3" id="logo_bg_3">
                    <label for="logo_bg_3"></label>
                  </span>
                                    <span>
                    <input type="radio" name="logo_bg" value="color_4" id="logo_bg_4">
                    <label for="logo_bg_4"></label>
                  </span>
                                    <span>
                    <input type="radio" name="logo_bg" value="color_5" id="logo_bg_5">
                    <label for="logo_bg_5"></label>
                  </span>
                                    <span>
                    <input type="radio" name="logo_bg" value="color_6" id="logo_bg_6">
                    <label for="logo_bg_6"></label>
                  </span>
                                    <span>
                    <input type="radio" name="logo_bg" value="color_7" id="logo_bg_7">
                    <label for="logo_bg_7"></label>
                  </span>
                                    <span>
                    <input type="radio" name="logo_bg" value="color_8" id="logo_bg_8">
                    <label for="logo_bg_8"></label>
                  </span>
                                </li>
                                <li class="drop-title"><p>头部</p></li>
                                <li class="drop-skin-li clearfix">
                  <span class="inverse">
                    <input type="radio" name="header_bg" value="default" id="header_bg_1" checked>
                    <label for="header_bg_1"></label>
                  </span>
                                    <span>
                    <input type="radio" name="header_bg" value="color_2" id="header_bg_2">
                    <label for="header_bg_2"></label>
                  </span>
                                    <span>
                    <input type="radio" name="header_bg" value="color_3" id="header_bg_3">
                    <label for="header_bg_3"></label>
                  </span>
                                    <span>
                    <input type="radio" name="header_bg" value="color_4" id="header_bg_4">
                    <label for="header_bg_4"></label>
                  </span>
                                    <span>
                    <input type="radio" name="header_bg" value="color_5" id="header_bg_5">
                    <label for="header_bg_5"></label>
                  </span>
                                    <span>
                    <input type="radio" name="header_bg" value="color_6" id="header_bg_6">
                    <label for="header_bg_6"></label>
                  </span>
                                    <span>
                    <input type="radio" name="header_bg" value="color_7" id="header_bg_7">
                    <label for="header_bg_7"></label>
                  </span>
                                    <span>
                    <input type="radio" name="header_bg" value="color_8" id="header_bg_8">
                    <label for="header_bg_8"></label>
                  </span>
                                </li>
                                <li class="drop-title"><p>侧边栏</p></li>
                                <li class="drop-skin-li clearfix">
                  <span class="inverse">
                    <input type="radio" name="sidebar_bg" value="default" id="sidebar_bg_1" checked>
                    <label for="sidebar_bg_1"></label>
                  </span>
                                    <span>
                    <input type="radio" name="sidebar_bg" value="color_2" id="sidebar_bg_2">
                    <label for="sidebar_bg_2"></label>
                  </span>
                                    <span>
                    <input type="radio" name="sidebar_bg" value="color_3" id="sidebar_bg_3">
                    <label for="sidebar_bg_3"></label>
                  </span>
                                    <span>
                    <input type="radio" name="sidebar_bg" value="color_4" id="sidebar_bg_4">
                    <label for="sidebar_bg_4"></label>
                  </span>
                                    <span>
                    <input type="radio" name="sidebar_bg" value="color_5" id="sidebar_bg_5">
                    <label for="sidebar_bg_5"></label>
                  </span>
                                    <span>
                    <input type="radio" name="sidebar_bg" value="color_6" id="sidebar_bg_6">
                    <label for="sidebar_bg_6"></label>
                  </span>
                                    <span>
                    <input type="radio" name="sidebar_bg" value="color_7" id="sidebar_bg_7">
                    <label for="sidebar_bg_7"></label>
                  </span>
                                    <span>
                    <input type="radio" name="sidebar_bg" value="color_8" id="sidebar_bg_8">
                    <label for="sidebar_bg_8"></label>
                  </span>
                                </li>
                            </ul>
                        </li>
                        <!--切换主题配色-->
                    </ul>

                </div>
            </nav>

        </header>
        <!--End 头部信息-->

        <!--页面主要内容-->
        <main class="lyear-layout-content">

            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="card-toolbar clearfix">
                                        <form class="form-inline" action="lyear_forms_elements.html" method="post" onsubmit="return false;">
                                            <div class="form-group">
                                                <button class="btn btn-default" >品牌名称</button>
                                                <input class="form-control" type="text" id="brand-name" placeholder="请输入品牌名称">
                                            </div>
                                            <div class="form-group">
                                                <select class="form-control" id="state-select" >
                                                    <option value="">全部</option>
                                                    <option value="1">已删除</option>
                                                    <option value="0">未删除</option>
                                                </select>

                                            </div>
                                            <div class="form-group">
                                                <button class="btn btn-primary" id="search-btn">查询</button>
                                            </div>
                                        </form>

                            </div>
                            <div class="card-body">

                                <div class="table-responsive">
                                    <table class="table table-bordered">
                                        <thead>
                                        <tr>
                                            <th>品牌编号</th>
                                            <th>品牌名称</th>
                                            <th>创建日期</th>
                                            <th>修改日期</th>
                                            <th>状态</th>
                                            <th>操作</th>
                                        </tr>
                                        </thead>
                                        <tbody id="brand-list">

                                        </tbody>
                                    </table>
                                </div>
                                <ul class="pagination">
                                    <button class="btn btn-primary" id="pre-btn">上一页</button>
                                    <button class="btn btn-primary" id="next-btn">下一页</button>
                                </ul>

                            </div>
                        </div>
                    </div>

                </div>
            </div>

        </main>
        <!--End 页面主要内容-->
    </div>
</div>
<script type="text/javascript" src="../../js/jquery.min.js"></script>
<script type="text/javascript" src="../../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="../../js/main.min.js"></script>
<script type="text/javascript" src="../../js/bootstrap-notify.min.js"></script>
<script type="text/javascript" src="../../js/lightyear.js"></script>
<script type="text/javascript" src="../../js/http.js"></script>
<script>
   $(function () {
       var preBtn = $('#pre-btn');
       var nextBtn = $('#next-btn');
       var brandNameInput = $('#brand-name');
       var brandListTbody = $('#brand-list');
       var searchBtn = $('#search-btn');
       var stateSelect = $('#state-select');
       var current = 1;
       var size = 10;
       var name = null;
       var isDelete = null;
       preBtn.click(perPage);
       nextBtn.click(nextPage);
       searchBtn.click(search);
       loadBrandList();
       function loadBrandList() {
           http.get("api/brand/list",{
               current:current,
               size:size,
               name:name,
               isDelete:isDelete
           },function (data) {
               var list = data.records;
               brandListTbody.empty();
               for (var i=0;i<list.length;i++){
                   var brand = list[i];
                   var tr = `<tr>
                          <td>${brand.id}</td>
                          <td>${brand.name}</td>
                          <td>${brand.gmtCreate}</td>
                          <td>${brand.gmtModified == null ? "无":brand.gmtModified}</td>
                          <td>${brand.isDelete == 0 ?"<span class='label label-success'>未删除</span>":"<span class='label label-warning'>已删除</span>"}</td>
                          <td>
                                 <button class="btn btn-label btn-primary" onclick="updateState.updateState(${brand.id},0,'brand')"><label><i class="mdi mdi-checkbox-marked-circle-outline"></i></label> 启用</button>
                                 <button class="btn btn-label btn-warning" onclick=""><label><i class="mdi mdi-delete-empty"></i></label> 修改</button>
                                 <button class="btn btn-label btn-danger" onclick="updateState.updateState(${brand.id},1,'brand')"><label><i class="mdi mdi-close"></i></label> 删除</button>

                          </td>
                          </tr>`;
                   brandListTbody.append(tr);
                   if (data.current ==1){
                       preBtn.addClass('disabled');
                   } else {
                       preBtn.removeClass('disabled');
                   };
                   if (data.current == data.pages){
                       nextBtn.addClass('disabled');
                   }else {
                       nextBtn.removeClass('disabled');
                   }
               }
           })
       };
       function perPage() {
           if (preBtn.hasClass('disabled')){
               return;
           }
           current--;
           loadBrandList();
       };
       function nextPage() {
           if (nextBtn.hasClass('disabled')){
               return;
           }
           current++;
           loadBrandList();
       }
       function search() {
           name = (!brandNameInput.val() ? null:brandNameInput.val());
           isDelete = stateSelect.val();
           current = 1;
           loadBrandList();
       }
   })
</script>
</body>
</html>